@use "sass:map";

// {bem_b,bem_e,bem_m,VueAndNvueStyleAttr,when,$namespace}
@use "./mixin/mixins.scss" as *;
@use './mixin/function.scss' as *;
// // {set-component-css-var}
@use "./mixin/_var.scss" as *;
// // { $form，$input-font-size}
@use "./common/var.scss" as *;

@import "common/index.scss";

@include bem_b(input) {
  @include flex(row);

  align-items: center;
  justify-content: space-between;
  flex: 1;
  @include VueAndNvueStyleAttr("padding","input", "padding");
  @include when(disabled){
	  
  }
  @include bem_m(radius) {
    border-radius: 4px;
  }
  @include bem_m(square) {
    border-radius: 4px;
  }
  @include bem_m(no-radius) {
    border-radius: 0;
  }
  @include bem_m(circle) {
    border-radius: 100px;
  }
  @include bem_m(border) {
    @include VueAndNvueStyleAttr("border-color","input", "border-color");
    @include VueAndNvueStyleAttr("border-width","input", "border-width");
    @include VueAndNvueStyleAttr("border-style","input", "border-style");
  }
  @include bem_m(border-bottom) {
	  border-width: 0;
    @include VueAndNvueStyleAttr("border-bottom-width","input", "border-width");
  }
  @include bem_e(content) {
    flex: 1;
    @include flex(row);
    align-items: center;
    justify-content: space-between;

    &__field-wrapper {
      position: relative;
      @include flex(row);
      margin: 0;
      flex: 1;

      &__field {
        @include VueAndNvueStyleAttr("line-height","input", "line-height");
        text-align: left;
        @include VueAndNvueStyleAttr("color","input", "color");
        @include VueAndNvueStyleAttr("height","input", "height");
        @include VueAndNvueStyleAttr("font-size","input", "font-size");
        flex: 1;
      }
    }

    &__clear {
      width: 20px;
      height: 20px;
      border-radius: 100px;
      background-color: #c6c7cb;
      @include flex(row);
      align-items: center;
      justify-content: center;
      transform: scale(0.82);
      margin-left: 4px;
    }

    &__subfix-icon {
      margin-left: 4px;
    }

    &__prefix-icon {
      margin-right: 4px;
    }
  }
}
